﻿
<div class="bui-page">
	<header class="bui-bar">
		<div class="bui-bar-left">
			<a class="bui-btn btn-back"><i class="icon-back"></i></a>
			
		</div>
		<div class="bui-bar-main">进度条</div>
		<div class="bui-bar-right">
		</div>
	</header>
	<main>
		<ul class="bui-list">
			<li class="bui-btn bui-box clearactive">
				<div class="bui-label">当前进度</div>
				<div class="span1">
					<progress class="bui-progress" max="100" value="30"></progress>
				</div>
			</li>
			<li class="bui-btn bui-box clearactive">
				<div class="bui-label">当前进度</div>
				<div class="span1">
					<progress class="bui-progress success" max="100" value="40"></progress>
				</div>
			</li>
			<li class="bui-btn bui-box clearactive">
				<div class="bui-label">当前进度</div>
				<div class="span1">
					<progress class="bui-progress warning" max="100" value="50"></progress>
				</div>
			</li>
			<li class="bui-btn bui-box clearactive">
				<div class="bui-label">当前进度</div>
				<div class="span1">
					<progress class="bui-progress danger" max="100" value="60"></progress>
				</div>
			</li>
			<li class="bui-btn bui-box clearactive">
				<div class="bui-label">当前进度</div>
				<div class="span1">
					<progress class="bui-progress" max="100" value="30"></progress>
				</div>
				<div class="bui-progress-text">30%</div>
			</li>

			<li class="bui-btn bui-box clearactive">
				<div class="bui-label">自定义样式</div>
				<div class="span1">
					<div class="bui-progress">
						<div class="bui-progress-cell" style="width:70%"></div>
					</div>
				</div>
				<div class="bui-progress-text">30%</div>
			</li>
		</ul>
		
	</main>
</div>
